<template>
  <div class="app-container">
    <el-form ref="queryForm" :model="queryParams" :inline="true" label-width="68px">

      <el-form-item label="车辆类型" prop="carType">
        <el-select v-model="queryParams.carType" placeholder="请选择车辆类型" clearable size="small">
          <el-option v-for="dict in carTypeOptions" :key="dict.dictValue" :label="dict.dictLabel"
            :value="dict.dictValue" />
        </el-select>
      </el-form-item>

      <el-form-item label="车牌号" prop="vin">
        <el-input v-model="queryParams.vin" placeholder="请输入车牌号" clearable size="small"
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="出车时间" prop="leaveHospTime" size="small" style="heigth:36px">
        <el-date-picker type="daterange" v-model="leaveHospTime" format="yyyy-MM-dd" size="small"
          value-format="yyyy-MM-dd" start-placeholder="开始日期" end-placeholder="结束日期" @change="handleChangeTime"
          range-separator="至" clearable></el-date-picker>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">

      </el-col>
    </el-row>

    <el-table v-loading="loading" :data="dispatchList" @selection-change="handleSelectionChange" height="70vh">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="编号" align="center" prop="dispatchID" width="180" :show-overflow-tooltip="true" />
      <el-table-column label="调度流水" align="center" prop="flow" width="180" :show-overflow-tooltip="true" />
      <el-table-column label="状态" align="center" prop="isOver" :formatter="isOverFormat" />
      <el-table-column label="调度状态" align="center" prop="status" :formatter="statusFormat" />
      <el-table-column label="车辆类型" align="center" prop="carType" :formatter="carTypeFormat" width="100" />
      <el-table-column label="车牌号" align="center" prop="vin" width="110" />
      <el-table-column label="接警时间" align="center" prop="receiveHelpTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.receiveHelpTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="调度时间" align="center" prop="dispatchTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.dispatchTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="出车时间" align="center" prop="leaveHospTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.leaveHospTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="出车司机" align="center" prop="driverName" width="110" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">查看</el-button>
          <el-button v-show="false" size="mini" type="text" icon="el-icon-del" @click="handleDispath(scope.row)">取消派车
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />

    <!-- 添加或修改调度记录基本信息对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <div v-show="cancelDispathStatus">
          <el-form-item label="收治医院名称" prop="hospital">
            <el-input v-model="form.hospital" placeholder="请输入收治医院名称" />
          </el-form-item>
          <el-form-item label="接警时间" prop="receiveHelpTime">
            <el-date-picker v-model="form.receiveHelpTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择接警时间" />
          </el-form-item>
          <el-form-item label="调度时间" prop="dispatchTime">
            <el-date-picker v-model="form.dispatchTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择调度时间" />
          </el-form-item>
          <el-form-item label="出车时间" prop="leaveHospTime">
            <el-date-picker v-model="form.leaveHospTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择出车时间" />
          </el-form-item>
          <el-form-item label="到达时间" prop="arriveDestTime">
            <el-date-picker v-model="form.arriveDestTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择到达时间" />
          </el-form-item>
          <el-form-item label="离开时间" prop="leaveDestTime">
            <el-date-picker v-model="form.leaveDestTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择离开时间" />
          </el-form-item>
          <el-form-item label="到达患者备注" prop="arriveDestContent">
            <el-input v-model="form.arriveDestContent" type="textarea" placeholder="请输入内容" />
          </el-form-item>
          <el-form-item label="到达医院时间" prop="arriveHostTime">
            <el-date-picker v-model="form.arriveHostTime" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择到达医院时间" />
          </el-form-item>
          <el-form-item label="到达医院备注" prop="arriveHosp">
            <el-input v-model="form.arriveHosp" type="textarea" placeholder="请输入内容" />
          </el-form-item>
          <el-form-item label="会诊开始" prop="treatStart">
            <el-date-picker v-model="form.treatStart" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择会诊开始" />
          </el-form-item>
          <el-form-item label="会诊结合" prop="treatEnd">
            <el-date-picker v-model="form.treatEnd" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择会诊结合" />
          </el-form-item>
          <el-form-item label="会诊内容" prop="treatContent">
            <el-input v-model="form.treatContent" type="textarea" placeholder="请输入内容" />
          </el-form-item>
          <el-form-item label="通话指导开始时间" prop="guideStart">
            <el-date-picker v-model="form.guideStart" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择通话指导开始时间" />
          </el-form-item>
          <el-form-item label="指导结束时间" prop="guideEnd">
            <el-date-picker v-model="form.guideEnd" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择指导结束时间" />
          </el-form-item>
          <el-form-item label="通话时长" prop="phoneGuideUseTime">
            <el-input v-model="form.phoneGuideUseTime" placeholder="请输入通话时长" />
          </el-form-item>
          <el-form-item label="指导内容" prop="guideContent">
            <el-input v-model="form.guideContent" type="textarea" placeholder="请输入内容" />
          </el-form-item>
          <el-form-item label="用药开始" prop="medicineStart">
            <el-date-picker v-model="form.medicineStart" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择用药开始" />
          </el-form-item>
          <el-form-item label="用药结束" prop="medicineEnd">
            <el-date-picker v-model="form.medicineEnd" clearable size="small" style="width: 200px" type="date"
              value-format="yyyy-MM-dd" placeholder="选择用药结束" />
          </el-form-item>
          <el-form-item label="调度状态">
            <el-select v-model="form.status" placeholder="请选择调度状态">
              <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)" />
            </el-select>
          </el-form-item>
          <el-form-item label="是否会诊" prop="isConsultation">
            <el-input v-model="form.isConsultation" placeholder="请输入是否会诊" />
          </el-form-item>
          <el-form-item label="车牌号" prop="vin">
            <el-input v-model="form.vin" placeholder="请输入车牌号" />
          </el-form-item>
          <el-form-item label="车辆类型">
            <el-select v-model="form.carType" placeholder="请选择车辆类型">
              <el-option v-for="dict in carTypeOptions" :key="dict.dictValue" :label="dict.dictLabel"
                :value="dict.dictValue" />
            </el-select>
          </el-form-item>
          <el-form-item label="医生姓名" prop="doctorName">
            <el-input v-model="form.doctorName" placeholder="请输入医生姓名" />
          </el-form-item>
          <el-form-item label="患者姓名" prop="patientName">
            <el-input v-model="form.patientName" placeholder="请输入患者姓名" />
          </el-form-item>
          <el-form-item label="患者身份证信息" prop="patientCard">
            <el-input v-model="form.patientCard" placeholder="请输入患者身份证信息" />
          </el-form-item>
          <el-form-item label="司机电话" prop="driverPhone">
            <el-input v-model="form.driverPhone" placeholder="请输入司机电话" />
          </el-form-item>
          <el-form-item label="医生电话" prop="doctorPhone">
            <el-input v-model="form.doctorPhone" placeholder="请输入医生电话" />
          </el-form-item>
          <el-form-item label="司机姓名" prop="driverName">
            <el-input v-model="form.driverName" placeholder="请输入司机姓名" />
          </el-form-item>
        </div>

        <el-form-item label="取消原因" prop="cancelReason">
          <el-input v-model="form.cancelReason" placeholder="请输入取消原因" :maxlength="11" show-word-limit clearable
            :style="{width: '100%'}"></el-input>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>

    </el-dialog>

    <!-- 调度指令详情 弹窗 -->
    <el-dialog title="调度指令详情" :visible.sync="Instructiondetails" width="70%" append-to-body @close="cancleDispatchK">
      <el-tag effect="dark" class="tag-bia-ies" size="mini">{{isOverFormat(form)}}</el-tag>
      <div class="top-ul-lis">
        <div class="p-text">调度流水号：{{form.flow}}</div>
        <div class="p-text">来源：120指挥中心</div>
        <div class="p-text">请求时间：{{form.receiveHelpTime}}</div>
        <div class="p-text">发送人：120指挥中心操作人</div>
        <div class="p-text">出车时间：{{form.leaveHospTime == undefined ? "暂未出车" : form.leaveHospTime}}</div>
      </div>
      <div class="box">
        <el-row>
          <el-col >
            <div class="line">
              <div class="title">患者姓名:</div>
              <div class="active-value">{{ form.bizPatient.name}}</div>
            </div>
            <div class="line">
              <div class="title">性别:</div>
              <div class="active-value">{{ form.bizPatient.sex == "0" ? "未知" : form.bizPatient.sex == "1" ? "男" : "女"}}
              </div>
            </div>
            <div class="line">
              <div class="title">年龄:</div>
              <div class="active-value">{{ form.bizPatient.age}}</div>
            </div>
            <div class="line">
              <div class="title">身份证号码:</div>
              <div class="active-value">{{ form.bizPatient.patientCard}}</div>
            </div>
            <div class="line">
              <div class="title">电话:</div>
              <div class="active-value">{{ form.bizPatient.phone}}</div>
            </div>
            <div class="second-title">
              <div class="title">主诉:</div>
              <div class="active-value">{{ form.bizPatient.majorCase}}</div>
            </div>
            <div class="second-title">
              <div class="title">上车地点:</div>
              <div class="active-value">{{ form.bizPatient.patientLocal}}</div>
            </div>
            <div class="second-title">
              <div class="title">目标医院:</div>
              <div class="active-value">{{ form.bizPatient.hospital}}</div>
            </div>
            <div class="second-title">
              <div class="title">电话录音:</div>
              <div class="active-value">
                <i class="el-icon-video-play video-play"></i>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>

      <div class="paicu-bak">
        <div class="ambulance">
          <div class="tisp">急救车：</div>
          <div class="lit">
            {{ form.bizCar.vin}}
            <span :class="form.bizCar.type == '0' ? 'green' : 'purple'">{{form.bizCar.type == "0" ? "普" : "卒"}}</span>
            <span class="equipment">车载设备</span>
          </div>
        </div>

        <div class="ambulance">
          <div class="tisp">随车司机：</div>
          <div class="lit">
            <span class="name">{{ form.bizDriver.name}}</span>
            <span class="default">{{ form.bizDriver.sex == "0" ? "未知" : form.bizDriver.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizDriver.age}}</span>
            <span class="default">{{ form.bizDriver.phone}}</span>
          </div>
        </div>

        <div class="ambulance">
          <div class="tisp">随车班组：</div>
          <div class="redso">{{ form.bizClass.name}}</div>
          <div class="lit end">
            <span class="name">{{ form.bizDoctor.name}}</span>
            <span class="default">{{ form.bizDoctor.sex == "0" ? "未知" : form.bizDoctor.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizDoctor.age}}</span>
            <span class="default">{{ form.bizDoctor.depart}}</span>
            <span class="default">{{ form.bizDoctor.title}}</span>
            <!-- <span class="default">外科</span> -->
            <span class="default">{{ form.bizDoctor.phone}}</span>
          </div>
          <div class="lit end">
            <span class="name">{{ form.bizNurse.name}}</span>
            <span class="default">{{ form.bizNurse.sex == "0" ? "未知" : form.bizNurse.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizNurse.age}}</span>
            <span class="default">{{ form.bizNurse.depart}}</span>
            <span class="default">{{ form.bizNurse.title}}</span>
            <!-- <span class="default">外科</span> -->
            <span class="default">{{ form.bizNurse.phone}}</span>
          </div>
        </div>

      </div>

      <div slot="footer" class="dialog-footer">
        <el-button type="danger" round @click="cancelCar" :disabled="form.isOver == 1 || form.isOver == 2">取消派车
        </el-button>
      </div>
    </el-dialog>
    <!-- 取消派车 弹窗 -->
    <el-dialog title="取消派车" :visible.sync="Cancelcardispatch" width="70%" append-to-body>
      <div class="top-ul-lis">
        <div class="p-text">调度流水号：{{form.flow}}</div>
        <div class="p-text">来源：120指挥中心</div>
        <div class="p-text">请求时间：{{form.receiveHelpTime}}</div>
        <div class="p-text">发送人：张志辉</div>
      </div>
      <div class="box">
        <el-row>
          <el-col :span="1.5">
            <div class="line">
              <div class="title">患者姓名:</div>
              <div class="active-value">{{ form.bizPatient.name}}</div>
            </div>
            <div class="line">
              <div class="title">性别:</div>
              <div class="active-value">{{ form.bizPatient.sex == "0" ? "未知" : form.bizPatient.sex == "1" ? "男" : "女"}}
              </div>
            </div>
            <div class="line">
              <div class="title">年龄:</div>
              <div class="active-value">{{ form.bizPatient.age}}</div>
            </div>
            <div class="line">
              <div class="title">身份证号码:</div>
              <div class="active-value">{{ form.bizPatient.patientCard}}</div>
            </div>
            <div class="line">
              <div class="title">电话:</div>
              <div class="active-value">{{ form.bizPatient.phone}}</div>
            </div>
            <div class="second-title">
              <div class="title">主诉:</div>
              <div class="active-value">{{ form.bizPatient.majorCase}}</div>
            </div>
            <div class="second-title">
              <div class="title">上车地点:</div>
              <div class="active-value">{{ form.bizPatient.patientLocal}}</div>
            </div>
            <div class="second-title">
              <div class="title">目标医院:</div>
              <div class="active-value">{{ form.bizPatient.hospital}}</div>
            </div>
            <div class="second-title">
              <div class="title">电话录音:</div>
              <div class="active-value">
                <i class="el-icon-video-play video-play"></i>
              </div>
            </div>
          </el-col>
        </el-row>
      </div>

      <div class="paicu-bak">
        <div class="ambulance">
          <div class="tisp">急救车：</div>
          <div class="lit">
            {{ form.bizCar.vin}}
            <span :class="form.bizCar.type == '0' ? 'green' : 'purple'">{{form.bizCar.type == "0" ? "普" : "卒"}}</span>
            <span class="equipment">车载设备</span>
          </div>
        </div>

        <div class="ambulance">
          <div class="tisp">随车司机：</div>
          <div class="lit">
            <span class="name">{{ form.bizDriver.name}}</span>
            <span class="default">{{ form.bizDriver.sex == "0" ? "未知" : form.bizDriver.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizDriver.age}}</span>
            <span class="default">{{ form.bizDriver.phone}}</span>
          </div>
        </div>

        <div class="ambulance">
          <div class="tisp">随车班组：</div>
          <div class="redso">{{ form.bizClass.name}}</div>
          <div class="lit end">
            <span class="name">{{ form.bizDoctor.name}}</span>
            <span class="default">{{ form.bizDoctor.sex == "0" ? "未知" : form.bizDoctor.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizDoctor.age}}</span>
            <span class="default">{{ form.bizDoctor.depart}}</span>
            <span class="default">{{ form.bizDoctor.title}}</span>
            <!-- <span class="default">外科</span> -->
            <span class="default">{{ form.bizDoctor.phone}}</span>
          </div>
          <div class="lit end">
            <span class="name">{{ form.bizNurse.name}}</span>
            <span class="default">{{ form.bizNurse.sex == "0" ? "未知" : form.bizNurse.sex == "1" ? "男" : "女"}}</span>
            <span class="default">{{ form.bizNurse.age}}</span>
            <span class="default">{{ form.bizNurse.depart}}</span>
            <span class="default">{{ form.bizNurse.title}}</span>
            <!-- <span class="default">外科</span> -->
            <span class="default">{{ form.bizNurse.phone}}</span>
          </div>
        </div>
        <div class="ambulance" style="float:left;margin-top: 50px">
          <div class="tisp">取消原因：</div>
          <div class="redso">
            <el-input v-model="form.cancelReason" placeholder="请输入取消原因"
              style="float:left;width:500px;margin-top: -10px;">
            </el-input>
          </div>
        </div>

      </div>

      <div slot="footer" class="dialog-footer">
        <el-button round @click="handleClickcalcle">取 消</el-button>
        <el-button type="danger" round @click="submitForm">确定取消</el-button>
      </div>
    </el-dialog>


  </div>


</template>

<script>
  import {
    listDispatch,
    getDispatch,
    delDispatch,
    addDispatch,
    updateDispatch,
    exportDispatch,
    cancleDispatch
  } from '@/api/biz/dispatch'

  export default {
    name: 'Dispatch',
    data() {
      return {
        cancelDispathStatus: true,
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        leaveHospTime: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 总条数
        total: 0,
        // 调度记录基本信息表格数据
        dispatchList: [],
        // 弹出层标题
        title: '',
        // 是否显示弹出层
        open: false,
        //调度指令详情 弹窗
        Instructiondetails: false,
        //取消派车 弹窗
        Cancelcardispatch: false,
        // 结束标识字典
        isOverOptions: [],
        // 调度状态字典
        statusOptions: [],
        // 是否会诊字典
        isConsultationOptions: [],
        // 车辆类型字典
        carTypeOptions: [],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          receiveHelpTime: undefined,
          status: undefined,
          isConsultation: undefined,
          vin: undefined,
          carType: undefined,
          doctorName: undefined,
          patientName: undefined,
          patientCard: undefined,
          driverPhone: undefined,
          doctorPhone: undefined,
          driverName: undefined,
          flow: undefined,
          cancelTime: undefined
        },
        // 表单参数
        form: {
          bizPatient: {
            name: '',
            sex: '',
            hospital: ''
          },
          bizDriver: {
            hospital: ''
          },
          bizClass: {
            name: ''
          },
          bizDoctor: {
            name: ''
          },
          bizNurse: {
            name: ''
          },
          bizCar: {
            vin: '',
          }
        },
        dispatchID:undefined,
        // 表单校验
        rules: {
          // cancelReason: [
          //   { required: true, message: '取消原因不能为空', trigger: 'blur' }
          // ],
        }
      }
    },
    mounted: function () {
      this.dispatchID = this.$route.query.dispatchID;

      if (this.dispatchID) {
        this.handleUpdatebyK(this.dispatchID);
      }
    },
    created() {
      this.getList()
      this.getDicts('dispath_is_over').then(response => {
        this.isOverOptions = response.data
      })
      this.getDicts('dispath_status').then(response => {
        this.statusOptions = response.data
      })
      this.getDicts('consultation_mark').then(response => {
        this.isConsultationOptions = response.data
      })
      this.getDicts('car_type').then(response => {
        this.carTypeOptions = response.data
      })
    },
    watch: {
      $route(){
        this.dispatchID = this.$route.query.dispatchID;
      },
      dispatchID() {
        if (this.dispatchID) {
          this.handleUpdatebyK(this.dispatchID)
        }
      },
      Instructiondetails() {
         if (this.Instructiondetails == false) {
            this.$router.push("/dispatch/dispatch")
         }
      }
    },

    methods: {
      handleChangeTime() {
        if (this.leaveHospTime !== undefined) {
          this.queryParams.leaveHospTime1 = this.leaveHospTime[0]
          this.queryParams.leaveHospTime2 = this.leaveHospTime[1]
        }
      },
      /** 查询调度记录基本信息列表 */
      getList() {
        this.loading = true
        listDispatch(this.queryParams).then(response => {
          this.dispatchList = response.rows
          this.total = response.total
          this.loading = false
        })
      },
      // 结束标识字典翻译
      isOverFormat(row, column) {
        // 派车 出车 取消 返回
        return this.selectDictLabel(this.isOverOptions, row.isOver)
      },
      // 调度状态字典翻译
      statusFormat(row, column) {
        return this.selectDictLabel(this.statusOptions, row.status)
      },
      // 是否会诊字典翻译
      isConsultationFormat(row, column) {
        return this.selectDictLabel(this.isConsultationOptions, row.isConsultation)
      },
      // 车辆类型字典翻译
      carTypeFormat(row, column) {
        return this.selectDictLabel(this.carTypeOptions, row.carType)
      },
      // 取消按钮
      cancel() {
        this.open = false
        this.reset()
      },
      handleClickcalcle() {
        this.Cancelcardispatch = false

      },
      // 表单重置
      reset() {
        this.form = {
          dispatchID: undefined,
          carID: undefined,
          isOver: undefined,
          classID: undefined,
          doctorID: undefined,
          nurseID: undefined,
          patientID: undefined,
          driverID: undefined,
          hospital: undefined,
          receiveHelpTime: undefined,
          dispatchTime: undefined,
          leaveHospTime: undefined,
          arriveDestTime: undefined,
          leaveDestTime: undefined,
          arriveDestContent: undefined,
          arriveHostTime: undefined,
          arriveHosp: undefined,
          treatStart: undefined,
          treatEnd: undefined,
          treatContent: undefined,
          guideStart: undefined,
          guideEnd: undefined,
          phoneGuideUseTime: undefined,
          guideContent: undefined,
          medicineStart: undefined,
          medicineEnd: undefined,
          status: undefined,
          isConsultation: undefined,
          vin: undefined,
          carType: undefined,
          doctorName: undefined,
          patientName: undefined,
          patientCard: undefined,
          driverPhone: undefined,
          doctorPhone: undefined,
          driverName: undefined,
          phoneType: undefined,
          uid: undefined,
          flow: undefined,
          cancelTime: undefined
        }
        this.resetForm('form')
        this.leaveHospTime = []
        this.queryParams.leaveHospTime1 = undefined
        this.queryParams.leaveHospTime2 = undefined
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1
        this.getList()
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm('queryForm')
        this.handleQuery()
        this.leaveHospTime = []
        this.queryParams.leaveHospTime1 = undefined
        this.queryParams.leaveHospTime2 = undefined
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.dispatchID)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset()
        this.open = true
        this.title = '添加调度记录基本信息'
      },
      /** 查看按钮操作 */
      handleUpdate(row) {
        // this.reset()
        const dispatchID = row.dispatchID || this.ids
        getDispatch(dispatchID).then(response => {
          this.form = response.data
          this.Instructiondetails = true
          this.title = '调度指令详情'
        })
      },

      // 跳转弹框
      handleUpdatebyK(dispatchID) {
        getDispatch(dispatchID).then(response => {
          this.form = response.data
          this.Instructiondetails = true
          this.title = '调度指令详情'
        })
      },

      cancleDispatchK() {
        this.Instructiondetails = false
      },


      handleDispath(row) {
        const dispatchID = row.dispatchID || this.ids
        this.form.dispatchID = dispatchID
        this.cancelDispathStatus = false
        this.open = true
        this.title = '调度指令详情'
      },
      cancelCar() {
        if (this.form.isOver == 0 || this.form.isOver == 3) {
          this.Cancelcardispatch = true
        } else {
          this.msgError("该调度已完成或已取消")
        }
      },
      /** 提交按钮 */
      submitForm: function () {
        if (this.form.cancelReason == null) {
          this.msgError("取消原因不能为空");
          return;
        }
        this.form.isOver = 2
        cancleDispatch(this.form).then(response => {
          if (response.code === 200) {
            this.msgSuccess('取消成功')
            this.open = false
            this.getList()
            this.Instructiondetails = false
            this.Cancelcardispatch = false
          } else {
            this.msgError(response.msg)
          }
        })
        // if(this.cancelDispathStatus == false){
        // }
        // else if (this.form.dispatchID !== undefined) {
        //   updateDispatch(this.form).then(response => {
        //     if (response.code === 200) {
        //       this.msgSuccess('修改成功')
        //       this.open = false
        //       this.getList()
        //     } else {
        //       this.msgError(response.msg)
        //     }
        //   })
        // } else {
        //   addDispatch(this.form).then(response => {
        //     if (response.code === 200) {
        //       this.msgSuccess('新增成功')
        //       this.open = false
        //       this.getList()
        //     } else {
        //       this.msgError(response.msg)
        //     }
        //   })
        // }
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const dispatchIDs = row.dispatchID || this.ids
        this.$confirm('是否确认删除调度记录基本信息编号为"' + dispatchIDs + '"的数据项?', '警告', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(function () {
          return delDispatch(dispatchIDs)
        }).then(() => {
          this.getList()
          this.msgSuccess('删除成功')
        }).catch(function () {})
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams
        this.$confirm('是否确认导出所有调度记录基本信息数据项?', '警告', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(function () {
          return exportDispatch(queryParams)
        }).then(response => {
          this.download(response.msg)
        }).catch(function () {})
      }
    }
  }

</script>
<style>
  .el-dialog {
    margin-bottom: 40px;
  }

</style>
<style scoped>
  .title {
    float: left;
    margin-left: 25px;
    font-weight: 1000;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
  }

  .line {
    float: left;
  }

  .active-value {
    float: left;
    color: #1890ff;
    margin-left: 15px;
    padding-top: 1.25rem;
  }

  .second-title {
    clear: left;
  }

  .second-title .title {
    padding-top: 0.5rem;
  }

  .second-title .active-value {
    padding-top: 0.5rem;
  }

  .second-title .active-value .video-play {
    color: #333;
    font-size: 22px;
    margin-top: -3px;
  }

  .box {
    background-color: #f9f9f9;
    margin-bottom: 2rem;
  }

  .top-ul-lis {
    width: 100%;
    margin: -10px 0 40px 0;
	overflow: hidden;
  }

  .top-ul-lis .p-text {
    float: left;
    font-size: 14px;
    color: #888888;
    margin-right: 30px;
    margin-top: 10px;
  }

  .paicu-bau {
    float: left;
    width: 100%;
    margin-top: -10px;
    margin-bottom: 30px;
  }

  .paicu-bau .gird {
    float: left;
    margin-right: 40px;
  }

  .paicu-bau .gird:last-child {
    margin-right: 0px;
  }

  .paicu-bau .gird .tisp {
    width: 235px;
    font-size: 14px;
    color: #333333;
  }

  .paicu-bau .gird .tase-list {
    width: 235px;
    height: 232px;
    background: rgba(248, 248, 248, 1);
    overflow: scroll;
    margin-top: 10px;
    padding: 10px 5px;
  }

  .paicu-bau .gird .tase-list .ul {}

  .paicu-bau .gird .tase-list .ul .el-radio {
    padding: 5px 10px;
  }

  .paicu-bau .gird .tase-list .ul .tib {
    font-size: 13px;
    color: #333;
    padding-bottom: 5px;
  }

  .paicu-bau .gird .tase-list .ul .lit {
    font-size: 13px;
    color: #333;
  }

  .paicu-bau .gird .tase-list .ul .end {
    margin-top: 2px;
    margin-bottom: 10px;
    margin-left: 35px;
  }

  .paicu-bau .gird .tase-list .ul .redso {
    font-size: 13px;
    color: #666;
  }

  .paicu-bau .gird .tase-list .ul .lit span {}

  .paicu-bau .gird .tase-list .ul .lit span.green {
    color: #0dbe09;
    padding: 0 10px;
  }

  .paicu-bau .gird .tase-list .ul .lit span.purple {
    color: #661dfb;
    padding: 0 10px;
  }

  .paicu-bau .gird .tase-list .ul .lit span.name {
    color: #00b6cc;
  }

  .paicu-bau .gird .tase-list .ul .lit span.default {
    margin-left: 10px;
  }

  .paicu-bau .gird .tase-list .ul .lit span.equipment {
    color: #00b6cc;
    /* padding:0 10px */
  }

  .el-alert {
    margin-top: 10px;
  }

  .noblank {
    padding-top: 15%;
  }

  .blankprompt-ico {
    width: 100%;
    text-align: center;
  }

  .blankprompt-ico i {
    color: #c9c9c9;
    font-size: 120px;
  }

  .blankprompt-text {
    width: 100%;
    color: #c9c9c9;
    text-align: center;
    font-size: 16px;
    margin-top: 20px;
  }

  .paicu-bak {
    float: left;
    width: 100%;
    margin-top: -10px;
    margin-bottom: 30px;
  }

  .paicu-bak .ambulance {
    float: left;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 10px;
  }

  .paicu-bak .ambulance .tisp {
    font-size: 14px;
    color: #333333;
    float: left;
  }

  .paicu-bak .ambulance .lit {
    font-size: 14px;
    color: #333;
  }

  .paicu-bak .ambulance .end {
    margin-top: 10px;
    margin-left: 70px;
  }

  .paicu-bak .ambulance .redso {
    font-size: 14px;
    color: #333;
  }

  .paicu-bak .ambulance .lit span {}

  .paicu-bak .ambulance .lit span.green {
    color: #0dbe09;
    padding: 0 10px;
  }

  .paicu-bak .ambulance .lit span.purple {
    color: #661dfb;
    padding: 0 10px;
  }

  .paicu-bak .ambulance .lit span.name {
    color: #00b6cc;
  }

  .paicu-bak .ambulance .lit span.default {
    margin-left: 10px;
  }

  .paicu-bak .ambulance .lit span.equipment {
    color: #00b6cc;
    /* padding:0 10px */
  }

  .tag-bia-ies {
    position: absolute;
    left: 160px;
    margin-top: -60px;
  }

  /* 分页 */
  .pagination-container {
    height: 80px;
    margin-top: 0px;
    padding: 23px 20px !important;
  }

  /* 分页  end */

</style>
